<template>
  <div style="position: relative;height: 100%;width: 100%;display: flex;padding: 10px 0 0 10px">
    <Userbar ref="userbar" v-on:update:conversation="updateConversation" :conversation="conversation"></Userbar>
    <ChatDialog ref="chatdialog" v-if="conversation != null" v-on:update:conversation="updateConversation" :disabled="true" :conversation="conversation"></ChatDialog>
  </div>
</template>

<script>
  import Userbar from './Userbar'
  import ChatDialog from './ChatDialog'
  export default {
    name: 'Cancel',
    data () {
      return {
        conversation:null
      }
    },
    components: { Userbar,ChatDialog },
    methods: {
      updateConversation:function (conversation) {
        this.conversation = conversation;
      }
    },
    mounted(){
      this.$refs.userbar.findConversation(2);
    }
  }
</script>

<style scoped>
</style>
